{include file='public/header'}
<div class="container">
    <div class="row">
        <div class="col-xs-12 col-md-12 col-lg-8">
            <!--文章循环开始-->
            {volist name="list" id="vo"}
                <div class="row blog-list">
                    <h2 class="col-xs-12 col-md-12 col-lg-12"><a href="{:url('index/article/read',['id'=>$vo.id])}">{$vo.blog_title}</a></h2>
                    <div class="col-xs-12 col-md-12 col-lg-12 m-p-10">
                        <ul class="row">
                            <li class="col-xs-5 col-md-2 col-lg-3"><span class="glyphicon glyphicon-user"></span>&nbsp;{$vo.blog_author}</li>
                            <li class="col-xs-5 col-md-2 col-lg-3"><span class="glyphicon glyphicon-calendar"></span>&nbsp;{$vo.create_time}</li>
                            <li class="col-xs-5 col-md-2 col-lg-3"><span class="glyphicon glyphicon-th-list"></span>&nbsp;{$vo->category->cat_name}</li>
                            <li class="col-xs-5 col-md-2 col-lg-3"><span class="glyphicon glyphicon-tags"></span>&nbsp;{$vo->tag->tname}</li>

                        </ul>
                    </div>
                    <div class="row">
                    	<div class="col-sm-2 col-md-2 col-xs-4 col-lg-4">
                    		<a class="thumbnail" href="{:url('index/article/read',['id'=>$vo.id])}">
                    			<img src="/thinkphp-practice/public/static/img/test.png"/>
                    		</a>
                    	</div>
                    	<div class="col-xs-8 col-md-12 col-lg-7 " id="blog_content" style="text-overflow:ellipsis;overflow:hidden;width: 500px;height: 120px">
                            <p class="col-xs-8 col-lg-7">{:strip_tags($vo.blog_content)}</p>
                    	</div>
                    </div>
                </div>
            {/volist}
            <!--文章循环结束-->
        </div>
        {include file='public/right'}
        <div class="col-xs-12 col-md-12 col-lg-8 text-center">
            {$list->render()}
        </div>

    </div>




</div>
<!--分页开始-->


<!--分页结束-->
{include file='public/footer'}
<script type="text/javascript">
    $(document).ready(function(){
        //多余的字显示...
        //可以重复使用
        var num = $('.blog-content').size();
        for(var i=0; i<num; i++){
            var titleStr = $(".blog-content").eq(i).text();
            var maxLen = 100;//设置要显示的字符数
            if(titleStr.length > maxLen) {
                $(".blog-content").eq(i).html(titleStr.substring(0, maxLen) + "...");
            }
            else{
                $(".blog-content").eq(i).html(titleStr);
            }
        }


    });
</script>
</body>
</html>